//
//  GiveItATry.swift
//  SnapCube
//
//  Created by Mars on 2022/12/23.
//

import SwiftUI

struct GiveItATry: View {
  var body: some View {
    VStack {
      // Virtual Rubik's Cube
      HStack {
        Button(action: {
          
        }, label: {
          Text("Perspective")
        })
        
        Text("|")
        
        Button(action: {
          
        }, label: {
          Text("Flat")
        })
        
        Text("|")
        
        Button(action: {
          
        }, label: {
          Text("3D")
        })
      }
      .padding(.top)
      .font(.caption)
      
      makeVirtualRubiksCube()
      
      Spacer()
      makeActionButtons()
      
      // Video guide
      
      Text("Step 1 Restore bottom cross")
        .font(.headline)
      
      ZStack {
        Color.black
          .frame(height: 200)
          .padding(.horizontal)
          
        
        Text("Video Player")
          .foregroundColor(.white)
      }
    }
    Text("Give it a try!")
      .navigationTitle("Give it a try")
  }
  
  
  func makeActionButtons() -> some View {
    VStack {
      HStack {
        Button(action: {
          // Rotate
        }, label: {
          Text("上")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
        
        Button(action: {
          // Rotate
        }, label: {
          Text("左")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
        
        Button(action: {
          // Rotate
        }, label: {
          Text("下")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
        
        Button(action: {
          // Rotate
        }, label: {
          Text("右")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
      }
      
      HStack {
        Button(action: {
          // Rotate
        }, label: {
          Text("上")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
        
        Button(action: {
          // Rotate
        }, label: {
          Text("左")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
        
        Button(action: {
          // Rotate
        }, label: {
          Text("下")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
        
        Button(action: {
          // Rotate
        }, label: {
          Text("右")
            .padding()
            .foregroundColor(.white)
            .background(Color.blue)
            .cornerRadius(12)
        })
      }
    }
  }
  
  // Draw the virtual rubik's cube
  func makeVirtualRubiksCube() -> some View {
    GeometryReader { proxy in
      
    }
    .border(Color.pink, width: 4)
  }
}

struct GiveItATry_Previews: PreviewProvider {
  static var previews: some View {
    GiveItATry()
  }
}
